<template>
	<view :class="isDark?'darkBg':''">
		<cu-custom :bgColor="isDark?'bg-black':'bg-blue'" isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">校园推文</block>
		</cu-custom>

		<view :class="isDark?'dark':''">
			<!-- <view style="height: 545rpx; background-size: cover;  background-position: center;"
				:style="{backgroundImage:isDark?'url(https://web.cloudduolc.cn/image/adblack7.png)':'url(https://web.cloudduolc.cn/image/adwhite5.png)'}">
				<ad unit-id="adunit-8b6bec1dd2b06de2" ad-type="video" :ad-theme="isDark?'black':'white'"></ad>
			</view> -->
			<view class="cu-bar bg-white solid-bottom" style="font-weight:bold" :class="isDark?'dark':'bg-white'">
				<view class="action">
					<text class="cuIcon-titles text-blue"></text>校园推文
					<text class="cuIcon-search"></text>
				</view>
				<view class="padding flex flex-wrap " :class="isDark?'dark':'bg-white'">

					<button class="cu-btn round line margin-top" @click="refresh()">
						<text class="cuIcon-refresh text-right" :class="isDark?'dark':''"></text>
					</button>

					<button open-type="contact" style="background-color:green;"
						class="cu-btn round line margin-left-xl  margin-top" v-if="client=='WECHAT'">
						<text class="text-white">我也想投放</text>
					</button>
					<button style="background-color:green;" @click="showTip"
						class="cu-btn round line margin-left-xl  margin-top" v-if="client!='WECHAT'">
						<text class="text-white">我也想投放</text>
					</button>
				</view>
			</view>


			<view class="margin  text-grey  shadow-warp cu-list menu card-menu" :class="isDark?'darkIn':'bg-white'"
				style="border: 3rpx solid #000000;">
				<view v-if="list.length==0" style="text-align: center;font-size: 40rpx;"
					:class="isDark?'darkIn':'bg-white'">


					<image src="../../../static/score/empty.png" style="width: 600rpx;height: 600rpx;margin-top: 0rpx;">
					</image>
				</view>
				<view v-for="(val,index) in list" :key="index" class="solids-bottom margin-bottom-sm">
					<view class="padding  radius" :class="isDark?'darkIn':'bg-white'">
						<view style="display: flex;">
							<span style="width:50rpx;">{{index+1}}</span>

							<span style="width:350rpx;"></span>

							<span style="margin-top: 12rpx;">{{val.addTime}}</span>
						</view>
						<view style="display: flex;" class="margin-top">

							<span class="cu-avatar round" :style="{backgroundImage:'url('+val.oriHeadImgUrl+')'}">
							</span>
							<span style="width:300rpx;margin-top: 12rpx;" class="margin-left" @click="getNickname"
								:data-nickname="val.nickname">{{val.nickname}}</span>
							<view class='cu-tag round bg-blue'>
								{{val.tag}}
							</view>
						</view>

						<view class="margin text-bold">{{val.title}}</view>
						<view class="margin-top margin-left">

							<image :src="val.msgCdnUrl" @click="goSee(val.url)"
								style="width: 600rpx;height: 250rpx;margin-top: 0rpx;  border-radius: 5px;">
							</image>
						</view>
					</view>
				</view>

			</view>


			<view class="cu-tabbar-height"></view>


		</view>
		<zmm-watermark>

		</zmm-watermark>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				list: [],
				total: 0,
				num: 0,
				isDark: this.isDark,
				showEmptyIcon: false,
				client: this.client,
				id: 0
			}
		},
		onLoad() {



		},
		onShow() {
			let _this = this
			_this.refresh()
		},
		onReachBottom() {
			let _this = this
			console.log("我已经滚动到底部了")
			_this.refresh()
		},
		methods: {
			getNickname(data) {
				console.log(data)
				uni.setClipboardData({
					data: data.currentTarget.dataset.nickname,
				});
			},
			goSee(url) {
				uni.openEmbeddedMiniProgram({
					appId: 'wx8259a2639cbab9bc', // 其他小程序APPID
					path: 'pages/webview/index', //其他小程序地址
					extraData: {
						'url': url
					},
					envVersion: 'trial',
					success: res => {
						// 打开成功
						console.log("打开成功", res);
					},
					fail: err => {
						console.log(err);
					}
				});
			},
			showTip: function() {
				uni.showToast({
					icon: 'none',
					title: '当前不支持网页和app，可前往小程序！',
					duration: 2000
				});
			},
			/**
			 * @description  请求网络数据
			 */
			refresh: function() {
				let _this = this
				var userInfo = _this.$store.state.userInfo
				if (userInfo.password == "" || userInfo.password == null) {
					uni.showModal({
						title: 'Hi',
						content: '会话已过期，\n当前功能需要登录,是否要去登录?\n(该程序的用户信息只存在手机本地，当切出程序需要重新登录)',
						confirmText: "去登录",
						cancelText: "再逛会",
						success: function(res) {
							if (res.confirm) {
								_this.$Router.navigateTo("/pages/bind/login/index")
							} else if (res.cancel) {
								console.log("点击了取消")
							} else {
								console.log("点击了别的")
							}
						}
					});
					return
				}
				var form = {
					"id": _this.id
				}

				_this.$schoolApi.tweetList(form).then(response => {
					//console.log(response.code)
					if (response.status == 0) {
						for (var i = 0; i < response.data.length; i++) {
							response.data[i].addTime = _this.$util.getTime(response.data[i].addTime)
							_this.list.push(response.data[i])
						}
						if (response.data.length == 0) {
							uni.showToast({
								icon: 'none',
								title: '已经到底了',
								duration: 2000
							});
						} else {
							uni.showToast({
								icon: 'none',
								title: '成功获取数据',
								duration: 2000
							});
						}

						_this.id = response.data[response.data.length - 1].id

					} else if (response.status != 608) {
						uni.showModal({
							title: '提示',
							content: response.msg,
							showCancel: false,
							success: function(res) {
								if (res.confirm) {

								} else if (res.cancel) {

								}
							}
						});
					}

				})

			}
		}

	}
</script>

<style>

</style>
